<template>
  <el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :before-close="cancel"
             :visible.sync="visible" append-to-body width="1020px">
    <el-form ref="dataForm" :inline="true" :model="dataForm" :rules="dataRule" size="small"
             @keyup.enter.native="dataFormSubmit()" label-width="200px">

      <el-form-item label="databaseHost" prop="databaseHost">
        <el-input v-model="dataForm.databaseHost" placeholder="" style="width: 245px;"></el-input>
      </el-form-item>
      <el-form-item label="databasePort" prop="databasePort">
        <el-input v-model="dataForm.databasePort" placeholder="" style="width: 245px;"></el-input>
      </el-form-item>
      <el-form-item label="databaseName" prop="databaseName">
        <el-input v-model="dataForm.databaseName" placeholder="" style="width: 245px;"></el-input>
      </el-form-item>
      <el-form-item label="databaseUserName" prop="databaseUserName">
        <el-input v-model="dataForm.databaseUserName" placeholder="" style="width: 245px;"></el-input>
      </el-form-item>
      <el-form-item label="databasePassword" prop="databasePassword">
        <el-input v-model="dataForm.databasePassword" placeholder="" style="width: 245px;"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
    import {
        queryTargetDatabaseConfigByCondition,
        updateTargetDatabaseConfig,
        saveTargetDatabaseConfigSingleLineData
    } from '@/api/TargetDatabaseConfig.js'

    export default {
        data() {
            return {
                visible: false,
                loading: false,
                dataForm: {
                    id: '',
                    databaseHost: '',
                    databasePort: '',
                    databaseName: '',
                    databaseUserName: '',
                    databasePassword: ''
                },
                dataRule: {
                    databaseHost: [
                        {required: true, message: '不能为空', trigger: 'blur'}
                    ],
                    databasePort: [
                        {required: true, message: '不能为空', trigger: 'blur'}
                    ],
                    databaseName: [
                        {required: true, message: '不能为空', trigger: 'blur'}
                    ],
                    databaseUserName: [
                        {required: true, message: '不能为空', trigger: 'blur'}
                    ],
                    databasePassword: [
                        {required: true, message: '不能为空', trigger: 'blur'}
                    ]
                }
            }
        },
        methods: {
            init(id) {
                this.dataForm.id = id || 0;
                this.visible = true;
                if (this.dataForm.id) {
                    queryTargetDatabaseConfigByCondition({id: this.dataForm.id}).then(res => {
                        if (res.hasError) {
                            this.$notify({
                                title: res.error.message,
                                type: 'fail',
                                duration: 2500
                            })
                        } else {
                            if (res.data === '') {
                                res.data = {};
                            }
                            this.dataForm = res.data;
                        }
                    }).catch(err => {
                        this.loading = false;
                        console.log(err.response.data.message);
                    })
                }
            },
            cancel() {
                this.resetForm();
            },
            resetForm() {
                this.visible = false;
                this.$refs['dataForm'].resetFields();
            },
            // 表单提交
            dataFormSubmit() {
                let id = this.dataForm.id;
                let saveParam = {
                    id: this.dataForm.id,
                    databaseHost: this.dataForm.databaseHost,
                    databasePort: this.dataForm.databasePort,
                    databaseName: this.dataForm.databaseName,
                    databaseUserName: this.dataForm.databaseUserName,
                    databasePassword: this.dataForm.databasePassword
                };
                if (id) {
                    this.doUpdate(saveParam);
                } else {
                    this.doSave(saveParam);
                }
            },
            doSave(saveParam) {
                saveTargetDatabaseConfigSingleLineData(saveParam).then(res => {
                    if (res.hasError) {
                        this.$notify({
                            title: res.error.message,
                            type: 'fail',
                            duration: 2500
                        })
                    } else {
                        this.$notify({
                            title: res.data,
                            type: 'success',
                            duration: 2500
                        })
                    }
                }).catch(err => {
                    this.loading = false;
                    console.log(err.response.data.message);
                })
            },
            doUpdate(saveParam) {
                updateTargetDatabaseConfig(saveParam).then(res => {
                    if (res.hasError) {
                        this.$notify({
                            title: res.error.message,
                            type: 'fail',
                            duration: 2500
                        })
                    } else {
                        this.$notify({
                            title: res.data,
                            type: 'success',
                            duration: 2500
                        })
                    }
                }).catch(err => {
                    this.loading = false;
                    console.log(err.response.data.message);
                })
            },
        }
    }
</script>
